import React, { PureComponent, Fragment } from 'react';
import { connect } from 'dva';
import {Icon, Modal, Button   } from 'antd';
import styles from './index.less';
import imgLogo from '../../assets/logoText.png'
@connect(({ global }) => ({
  global,
}))

export default class SystemInfo extends PureComponent {
  state = {
    verionData: {},
    systemModalVisible: false,
  }
  componentDidMount() {
    const { dispatch } = this.props;
    dispatch({
      type: 'global/infoList',
      callback: (res) => {
        if(res.result == "ok") {
          this.setState({
            verionData: res.data,
          })
        }
      },
    })
  }

  handleSystemModalVisible = (flag) => {
    this.setState({
      systemModalVisible: !!flag,
    });
  };

  render() {
    const { verionData, systemModalVisible }=this.state;
    const systemMethods = {
      handleSystemModalVisible: this.handleSystemModalVisible,
    };
    return (
      <Fragment>
        <SystemBox {...systemMethods} systemModalVisible={systemModalVisible} verionData={verionData}/>
          <Icon type="info-circle" theme="twoTone" onClick={ () =>this.handleSystemModalVisible(true) } style={{fontSize:'20px'}}/>
      </Fragment>        
    );
  }
}

class SystemBox extends PureComponent {
  constructor(props) {
    super(props);
  }

  render() {
    const {systemModalVisible, handleSystemModalVisible, verionData} = this.props;
    return (
      <Modal
        destroyOnClose
        width={450}
        title=""
        visible={systemModalVisible}
        onCancel={() => handleSystemModalVisible(false)}
        footer={null}
      >
        <div className={styles.systemInfo}>
            <img src={imgLogo}/>
            <dl>
              <dt>{verionData.systemTitle}</dt>
              <dd>产品版本：{verionData.productVersion}</dd>
              <dd className={styles.ddLast}>发布日期：{verionData.publishDate}</dd>
              <dd>Copyright &copy;{verionData.copyRightInfo}</dd>
              <dd className={styles.ssA}><a href={'http://' + verionData.busWeb} target="_blank">{verionData.busWeb}</a></dd>
            </dl>            
          </div>
      </Modal>
    );
  }
}
